<template>
	<div class="wrapper" v-if="show">
	  <span class="iconfont icon-shanchuguanbicha close" @click="close"></span>
	  <div class="cloum-line"></div>
	  <div class="block">
	    <img class="expression" src="../../static/images/prize_2.png" />
	    <span class="a">您还没有注册哦~</span>
	    <span class="b">注册成为【黄蜂鱼】小程序用户</span>
	    <span class="b">即可参与活动</span>
	    <div class="reg" @click="register">立即注册</div>
	  </div>
	</div>
</template>
<script>

export default {
	name: "index",
  props:{
    show: false
  },
	data() {
		return {

		};
	},
	created() {

	},
	mounted() {

	},
	methods: {
    close(){
      this.$emit('update:show', false);
    },
    register(){
      this.$emit('register');
    }
	}
};
</script>
<style scoped>

.wrapper {
  z-index: 999;
  width: 100%;
  height: 9rem;
  position:fixed;
  top: .8rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.close{
  font-size: .8rem;
  color: #ffffff;
  margin-bottom: -.05rem;
}

.cloum-line{
  background-color: #ffffff;
  width: .04rem;
  height: 1.2rem;
  margin-bottom: -.5rem;
}

.block {
  width: 6rem;
  height: 7rem;
  background: url("../../static/images/tishikuang.png") top center no-repeat;
  background-size: 6rem 7rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.expression{
  width: 2.1rem;
  height: 1.4rem;
  margin-top: 1.8rem;
}

.a{
  color:#ffffff;
  font-size: .4rem;
}

.b{
  color:#ffffff;
  font-size: .25rem;
  line-height: .5rem;
}

.reg{
  width: 3rem;
  height: .8rem;
  line-height: .8rem;
  font-weight: 800;
  text-align: center;
  background-color: #FFFFFF;
  color: #ec611e;
  font-size: .4rem;
  border-radius: .4rem;
  margin-top: .6rem;
}

</style>
